<html>
<head>
    <title>
        Gestalt Sample: 2D drawing with Canvas
    </title>
    <script src="../../js/jquery.js" type="text/javascript"></script>
    <script src="../../js/gestalt.js" type="text/javascript"></script>
    <script type="application/x-javascript">
        function draw() {
         var canvas = document.getElementById("canvas");
         var ctx = canvas.getContext("2d");

         ctx.fillStyle = "rgb(200,0,0)";
         ctx.fillRect (10, 10, 55, 50);

         ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
         ctx.fillRect (30, 30, 55, 50);
        }
  </script>

</head>
<body onload="draw()">

<!-- This isn't a part of the sample, but a link back to the Gestalt site -->
<div id="upsell" style="color:#fff; font-size: 13px; font-family:'Lucida Grande','Lucida Sans Unicode',Helvetica,Arial,Lucida,Verdana,sans-serif; margin-bottom: 30px;">
    <a href="http://www.visitmix.com/labs/gestalt/samples/" style="background-color: #000; color: #fff; display: block; text-decoration: none;" onmouseover="this.style.color='#000'; this.style.background='#ccc'" onmouseout="this.style.color='#fff'; this.style.background='#000'">
		<span style="display:block; padding: 8px; text-align:center;">&laquo; Check out other samples on the Gestalt web site</span>
	</a>
</div>

<canvas id="canvas" width="300" height="300"></canvas>
<script language="python">
from System import Array
canvas = document.canvas
#ctx = canvas.getContext "2d"
ctx = canvas.Invoke("getContext", Array[object](["2d"]))
#window.Alert(document.output.GetType().ToString())
ctx.SetProperty("fillStyle", "rgba(0, 200, 0, 0.5)")
res = ctx.Invoke("fillRect", Array[object]([50, 50, 55, 50]))
</script>
</body>
</html>
    